<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>External Services</title>
    <script src="cookie.js"></script>
    <script src="ip_address.js"></script>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
    <script src="LetsChat_page.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
    <script src="LetsChat_room.js"></script>
    <link rel="stylesheet" href="LetsChat.css">
    <script src="LetsChat.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
    <link rel = "icon" href =  
"https://cdn.jim-nielsen.com/ios/512/spike-email-messenger-chat-2019-05-01.png" 
        type = "image/x-icon">
        <link rel="preconnect" href="https://fonts.gstatic.com">
        <link href="https://fonts.googleapis.com/css2?family=Oi&display=swap" rel="stylesheet">
        <script src="https://www.gstatic.com/firebasejs/7.6.2/firebase-app.js"></script>
        <script src="https://www.gstatic.com/firebasejs/7.6.2/firebase-firestore.js"></script>
        <script src="https://www.gstatic.com/firebasejs/live/3.1/firebase.js"></script>
        <link href="https://fonts.googleapis.com/css?family=Yeon+Sung&display=swap" rel="stylesheet"><meta name="viewport" content="width=device-width, initial-scale=1">
        <script src="settings.js"></script>
</head>
<body>

    <!--
Navigation bar code here
-->
<nav class="navbar-inverse my_nav_bar">
	<div class="navbar-header">
		<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
			<span class="icon-bar">
  
			</span>
			<span class="icon-bar">
				
			</span>
			<span class="icon-bar">
				
			</span>
			
		</button>
		<a class="navbar-brand" href="LetsChat_room.html">
			LetsChat
		</a>
		<!--Menu-->
		<!--List of Menus
		School name
  
  Campus life
  
  Achievements
  
  What’s New
  
  Contact us
  -->
	</div>
	<div class="collapse navbar-collapse" id="myNavbar">
		<ul class="nav navbar-nav">
			<li><a href="extra.html" id="extra_services">External Services</a></li>
			<!--<li><a href="whatsnew.html">Whats New</a></li>
			<li><a href="#whatsnew">What Is New</a></li>
			<li><a href="#contact">Contact Us</a></li>-->
		</ul>
	</div>
  </nav>

    
<center>
    
    <section id="game">
        <h1>Games</h1>
        <div class="line"></div>
        <a href="https://studio.code.org/projects/flappy/g72VQ2qARqfHb1hw9h6P8muWyO6e0HC84ZZhVE0OSj8" target="_blank">
            <img src="flappy.png" alt="FlappyRandomizer" srcset="FlappyRandomizer">
        </a>
        
    </section>
    <section id="chatbot">
        <h1>ChatBots</h1>
        <div class="line"></div>
        <iframe allow="microphone;" height="430" width="430" src="https://console.dialogflow.com/api-client/demo/embedded/a675261e-35c6-461a-b128-f5901ec8924d"></iframe>
    </section>
    
</center> 
    
<script src="https://www.gstatic.com/dialogflow-console/fast/messenger/bootstrap.js?v=1"></script>
<df-messenger
  intent="WELCOME"
  chat-title="LetsBotBETA"
  agent-id="a675261e-35c6-461a-b128-f5901ec8924d"
  language-code="en"
></df-messenger>
</body>
</html>